<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<!-- author
黎凯 -->
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
</head>
<body>
	<script type="text/javascript">
		/* 选项卡操作 */
		$(function() {
			$(".nav_btnl").linkbutton({
				onClick : function() {
					var title = $(this).text();
					var url = $(this).attr("id");
					//判断该面板是否已打开
					if($("#tt").tabs("exists", title)){
						//已存在则激活
						$("#tt").tabs("select", title);
					}else{
						//不存在
						var config = {
								title: title,
								href: url,
								closable: true
							}
						$("#tt").tabs("add", config);
					}
				}
			});
		})
		/* 生日操作设置 */
		function dojobbirth(value, row, index) {
			var write = "", dojobbirthdetail = "";
			
			dojobbirthdetail = "<a onclick='birthdetail(" + row.empid+ ")' class='easyui-linkbutton button-teal handle-btn'>朋友详情</a>";
			write = "<a onclick='writedo("  + row.empid+ ")' class='easyui-linkbutton button-darkblue handle-btn'>写信</a>";
			return dojobbirthdetail + write;
		}
		/* 生日朋友详情 */
		function birthdetail(empid){
			$("#birthdetailinfo").datagrid({url: "birthdetail?empid=" + empid});
			$("#birthdetailid").window("open");
		}
		
		/* 打开写信给朋友窗口 */
		function writedo(empid){
			$.post('getnamebyempid', {empid:empid}, function(data){
				$("#reservename").text(data);
				$("#writeforbirth").window('open');
			});
		}
	
		/* 打开更新信息窗口 */
		function updateinfo(){
			$("#updatewithemail").window('open');
		}	
		
		/* 发生日祝福信给朋友 */
		function writeforfri(){
			var reserveemp=$("#reservename").text();
			var theme=$("#themea").val();
			var text=$("#text").val();
			$.post('postemailforbir',{reserveemp:reserveemp,theme:theme,text:text},function(data){
				$.messager.alert('提示', '发送成功！', 'info'); 
				$("#writeforbirth").window('close');
			}); 
		}
	</script>
	<!-- 邮箱主页面 -->
	<div  id="boss"  fit="true">
		<div align="left" style="float:left;height:100%;border-right:2px solid #E4E8F7;margin-top:5px;margin-left:5px;">
			<!-- 邮箱修改按钮 -->
			<div style="width:100%;">
				<div>
					<a id="update" class="easyui-linkbutton" onclick="updateinfo()" iconCls="icon-aeditemail" style="text-align:left;width:100px;">
						<font color="#A6A6A6">
							<c:if test="${!empty empUseByemailVo.emp.empEmail }">
								${empUseByemailVo.emp.empName }
							</c:if>
							<c:if test="${empty empUseByemailVo.emp.empEmail }">
								(你还没有邮箱！点击完善)
							</c:if>
						</font>
					</a>
				</div>
			</div>
			<!-- 写信按钮 -->
			<div>
				<a id="to_writeemail" class="easyui-linkbutton nav_btnl" iconCls="icon-awriteemail" style="width:100%;text-align:left;">
					<font color="#6A98CE">
						写&nbsp;&nbsp;信
					</font>
				</a>
			</div>				
			<div style="border:1px solid #E4E8F7;width:100%;height:2px;margin:2px 0px;background:#E4E8F7;"></div>
			<!-- 收件箱 -->
			<div style="width:100%;">
				<a class="easyui-linkbutton nav_btnl" id="to_reservejsp" style="width:100%;text-align:left;">
					<font color="#6A98CE">
						收&nbsp;件&nbsp;箱
					</font>
				</a>
			</div>
			<!-- 草稿箱 -->
			<div style="width:100%;">
				<a class="easyui-linkbutton nav_btnl" id="to_savedemailjsp" style="width:100%;text-align:left;">
						<font color="#6A98CE">
							草&nbsp;稿&nbsp;箱
						</font>
					</a>
			</div>
			<!-- 已发送 -->
			<div style="width:100%;">
				<a class="easyui-linkbutton nav_btnl" id="to_makedemailjsp" style="width:100%;text-align:left;">
						<font color="#6A98CE">
							已&nbsp;发&nbsp;送
						</font>
					</a>
			</div>
			<!-- 垃圾箱 -->
			<div style="width:100%;">
				<a class="easyui-linkbutton nav_btnl" id="to_deletedemailjsp" style="width:100%;text-align:left;">
						<font color="#6A98CE">
							垃&nbsp;圾&nbsp;箱
						</font>
					</a>
			</div>
		</div>
		<!-- 邮箱主显示页面 -->
		<div id="theme" style="float:left;width:90%;height:100%;margin-top:5px;margin-left:5px;
		    "><!-- background:url('insdep/icons/askywhite.jpg')no-repeat;background-size:100%; -->
			<div style="margin-left:5px;margin-top:5px;font-size:20px;align:left;">
				${empUseByemailVo.hour }<span style="color:#4E5494;">${empUseByemailVo.emp.empName }。</span>
			</div>	
			<div style="margin-left:5px;margin-top:5px;cursor:default;font-size:15px;">
				<a id="to_reservejsp" class="nav_btnl" style="border-bottom:1px solid black;">
					你有
					<span style="color:#CC0000;">${empUseByemailVo.num }</span>
					封邮件未查看!
				</a>
			</div>	
			<!-- 今天的朋友生日 -->
			<div style="border:2px solid #DADADA;margin:5px 10px;height:83%;width:auto;">
				<div title="" style="border:1px solid white;float:left;width:33%;height:100%; ">
					<div style="height:10%;background:#DADADA;text-align:center;">
						<div style="padding-top:8px;">${empUseByemailVo.timeVo.today }（今天）朋友生日</div>
					</div>
					<div style="height:89%;width:100%;">
						<table id="todaybirth-list" class="easyui-datagrid" style="height:100%;width:100%;"
						data-options="
							url:'todaybirth',
							autoRowHeight:false,
							pagination:true,
							singleSelect:true,
							fitColumns:true,
							remoteSort:false,
							pageList:[5,10]
						">   
        				<thead>   
				            <tr>
				            	<th style="width:27%;" align="center" data-options="field:'empname'">姓名</th> 
				            	<th style="width:30%;" align="center" data-options="field:'position'">职位</th>	  
				            	<th style="width:50%;" align="center" data-options="field:'dojob',formatter:dojobbirth">操作</th>                 
				            </tr>   
       					</thead>   
    					</table>
					</div>
				</div>
				<div title="" style="border:1px solid white;float:left;width:33%;height:100%; ">
					<div style="height:10%;background:#DADADA;text-align:center;">
						<div style="padding-top:8px;">${empUseByemailVo.timeVo.tomorrow }</div>
					</div>
					<div style="height:89%;width:100%;">
						<table id="tomorrowbirth-list" class="easyui-datagrid" style="height:100%;width:100%;"
						data-options="
							url:'tomorrowbirth',
							autoRowHeight:false,
							pagination:true,
							singleSelect:true,
							fitColumns:true,
							remoteSort:false,
							pageList:[5,10]
						">   
        				<thead>   
				            <tr>
				            	<th style="width:25%;" align="center" data-options="field:'empname'">姓名</th> 
				            	<th style="width:30%;" align="center" data-options="field:'position'">职位</th>	  
				            	<th style="width:50%;" align="center" data-options="field:'dojob',formatter:dojobbirth">操作</th>                
				            </tr>   
       					</thead>   
    					</table>
					</div>
				</div>
				<div title="" style="border:1px solid white;float:left;width:33%;height:100%; ">
					<div style="height:10%;background:#DADADA;text-align:center;">
						<div style="padding-top:8px;">${empUseByemailVo.timeVo.thethirdday }（后天）朋友生日</div>
					</div>
					<div style="height:89%;width:100%;">
						<table id="thethirdbirth-list" class="easyui-datagrid" style="height:100%;width:100%;"
						data-options="
							url:'thethirdbirth',
							autoRowHeight:false,
							pagination:true,
							singleSelect:true,
							fitColumns:true,
							remoteSort:false,
							pageList:[5,10]
						">   
        				<thead>   
				            <tr>
				            	<th style="width:25%;" align="center" data-options="field:'empname'">姓名</th> 
				            	<th style="width:30%;" align="center" data-options="field:'position'">职位</th>	  
				            	<th style="width:50%;" align="center" data-options="field:'dojob',formatter:dojobbirth">操作</th>                 
				            </tr>   
       					</thead>   
    					</table>
					</div>
				</div>
			</div>
		</div>
		
		<!-- 收信窗口 -->
		<%-- <div id="reserveemail" style="display:none;float:left;width:82%;height:100%;margin-top:5px;margin-left:5px;
		    ">
			<div style="margin-left:5px;margin-top:5px;font-size:20px;align:left;">
				${empUseByemailVo.hour }<span style="color:#4E5494;">${empUseByemailVo.emp.empName }。</span>
			</div>	收信
		</div> --%>
		<!-- 通讯录窗口 -->
		<div id="telcard" style="display:none;float:left;width:82%;height:100%;margin-top:5px;margin-left:5px;
		    ">
			<div style="margin-left:5px;margin-top:5px;font-size:20px;align:left;">
				${empUseByemailVo.hour }<span style="color:#4E5494;">${empUseByemailVo.emp.empName }。</span>
			</div>	通讯录
		</div>
		
	</div>
	
	
	<div>
	
	</div>
	<!-- 更新信息窗口 -->
	<div id="updatewithemail" class="easyui-window" title="更新信息" data-options="collapsible:false,minimizable:false,maximizable:false,modal:true,iconCls:'icon-save', closed: true" style="width:400px;height:240px;padding:5px;">
        <div class="easyui-layout" data-options="fit:true">
         <div data-options="region:'center'">
         	<form id="modifyemail" method="post" action="modifyemail">
	        	<div style="margin-top:10px;width:180px;float:left;">姓名：${empUseByemailVo.emp.empName }</div>       	
	        	<div style="margin-top:10px;width:180px;float:left;">部门: ${empUseByemailVo.emp.dept.deptName }</div>
	        	<div style="margin-top:10px;width:180px;float:left;">职位：${empUseByemailVo.emp.position.positionName }</div> 
	        	<div style="margin-top:10px;width:180px;float:left;">
	        		<c:if test="${empUseByemailVo.emp.empSex==1 }">
	        			性别：男
	        		</c:if>
	        		<c:if test="${empUseByemailVo.emp.empSex==0 }">
	        			性别：女
	        		</c:if>
	        	</div>
	        	<div style="margin-top:10px;width:180px;float:left;">电话：${empUseByemailVo.emp.empPhone }</div>
	        	<div style="margin-top:10px;width:180px;float:left;">QQ：${empUseByemailVo.emp.emp_QQ }</div>
	        	<div style="margin-top:10px;width:180px;float:left;">生日：${empUseByemailVo.emp.empBirthday }</div>
	        	<div style="margin-top:10px;width:180px;float:left;">入职时间：${empUseByemailVo.emp.empEntertime }</div>
	        	<div style="margin-top:10px;float:left;font-size:20px;">
	        		<span style="font-weight:bolder;">邮箱:</span>
	        		<input name="email" type="text" value="${empUseByemailVo.emp.empEmail }" style="border:1px solid #FF8400; ">
	        	</div>
        	</form>
        </div>
        	<div data-options="region:'south',border:false" style="text-align:center;padding:5px 0 0;float:left;">
                <a class="easyui-linkbutton" data-options="iconCls:'icon-ok', plain:true, onClick:function(){
                    $('#modifyemail').form({
                        onSubmit:function(params){
                            return $(this).form('validate');
                        },
                        success:function(info){
                            var b = displayInfo(info);
                            if(b){
                                $.messager.alert('提示', '更新成功！', 'info', function(){
                                	$('#updatewithemail').window('close');
                                });                                
                            }
                        }
                    }).submit();
                }">
                	保存
                </a>
                <a class="easyui-linkbutton" data-options="iconCls:'icon-cancel', plain:true" href="javascript:void(0)" onclick="$('#updatewithemail').window('close');">关闭</a>
            </div>
        
        </div>
    </div>
    
    <!-- 生日朋友生日详情 -->
    <div id="birthdetailid" class="easyui-window" title="朋友详情" data-options="collapsible:false,minimizable:false,maximizable:false,modal:true, closed: true" style="width:350px;height:310px;padding:5px;">
        <div class="easyui-layout" data-options="fit:true">
            <table border="0" id="birthdetailinfo" class="easyui-datagrid" style="height:100%;width:100%;"   
                data-options=" fitColumns:true,singleSelect:true,
                				autoRowHeight:true,singleSelect:true
                " >   
                <thead>   
                    <tr style="border:1px solid white;height:100%;width:100%;">
                    	<th data-options="field:'name'" align="center" style="width:40%;"></th>   
                        <th data-options="field:'value'" style="width:65%;"></th>                          
                    </tr>   
                </thead>   
            </table>
                 
            <div data-options="region:'south',border:false" style="text-align:right;padding:5px 0 0;">
                <a class="easyui-linkbutton" data-options="iconCls:'icon-cancel', plain:true" href="javascript:void(0)" onclick="$('#birthdetailid').window('close');">关闭</a>
            </div>
        </div>
    </div>
    
    <!-- 写信给朋友 -->
    <div id="writeforbirth" class="easyui-window" title="写信给朋友" data-options="collapsible:false,minimizable:false,maximizable:false,modal:true, closed: true" style="width:550px;height:400px;padding:5px;">
        <div class="easyui-layout" data-options="fit:true">
            <!-- 收件人 -->
            <div style="float:left;margin-top:5px;">
            	<div style="float:left;">收件人:&nbsp;</div><div id="reservename" style="float:left;"></div>
            </div>
            <!-- 主题 -->
            <div style="clear:both;margin-top:30px;">
            	主&nbsp;&nbsp;题:&nbsp;<input id="themea" class="easyui-textbox" value="生日快乐" style="width:90%;border:1px solid #DADADA;">
            </div> 
            <!-- 内容  -->
            <div style="clear:both;margin-top:20px;">
            	<input id="text" class="easyui-textbox" value="祝你生日快乐！" label="内&nbsp;&nbsp;&nbsp;容:" multiline="true"
            	style="width:96%;height:95%;border:1px solid #DADADA;">
            </div> 
               
            <div data-options="region:'south',border:false" style="text-align:right;padding:5px 0 0;">
            	<a class="easyui-linkbutton" data-options="iconCls:'icon-ok', plain:true" href="javascript:void(0)" onclick="writeforfri()">发送</a>
                <a class="easyui-linkbutton" data-options="iconCls:'icon-cancel', plain:true" href="javascript:void(0)" onclick="$('#writeforbirth').window('close');">关闭</a>
                
            </div>
        </div>
    </div>
</body>
</html>